<template>
  <div>
    <el-row >
      <el-col :span="6"><span class="mytext">商品信息</span> </el-col>
      <el-col :span="6"><span class="mytext">评价内容</span></el-col>
      <el-col :span="6"><span class="mytext">质量评价</span></el-col>
      <el-col :span="6"><span class="mytext">服务评价</span></el-col>
    </el-row>
    <div v-for="o in records" >
      <el-table  :show-header="status" class="mytop"  border  :data="o.detailList" >
        <el-table-column  prop="shopInfo.shopName"></el-table-column>
        <el-table-column  prop="content"></el-table-column>
        <el-table-column >
          <template slot-scope="scope">
            <el-rate disabled v-model="scope.row.qualityStars" show-text>
            </el-rate>
          </template>
        </el-table-column>
        <el-table-column>
          <template slot-scope="scope">
            <el-rate disabled v-model="scope.row.describeStars" show-text>
            </el-rate>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <el-row>
      <el-col :span="8" :offset="8">
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageno"
          :page-sizes="[5, 10, 15, 20]"
          :page-size="pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
        >
        </el-pagination>
      </el-col>
    </el-row>
  </div>
</template>

<script>
  export default {
    name: "UserCommentView",
    data() {
      return {
        user: {id: sessionStorage.getItem("id")},
        pageno: 1,
        pagesize: 5,
        total: 1,
        records: [],
        status:false, //显示头部
      }
    },
    methods: {
      getData() {
        var params = {};
        params["pageno"] = this.pageno;
        params["pagesize"] = this.pagesize;
        params["uid"] = this.user.id;
        this.$axios
          .get("commodity/commodity.action")
          .then(res => {
            this.records = res.data.records;
            this.total = res.data.total;
          })
          .catch(err => {
            this.$message.error(err)
          })
      },
      handleSizeChange(val) {
        //每页范围
        this.pagesize = val;
        this.getData();
      },
      handleCurrentChange(val) {
        //当前页
        this.pageno = val;
        this.getData();
      },
    },
    created() {
      this.getData();
    }
  }
</script>

<style scoped>
.mytop{
  margin-top: 20px;
  margin-bottom: 5px;
}
  .mytext{
    padding-left: 20px;
  }
</style>
